<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.org/ui">

    <body>

        <ui:composition template="./principal.xhtml">

            <ui:define name="body-title">
                Busqueda de empleado
            </ui:define>

            <ui:define name="body">
                <p:panelGrid columns="2">
                        <h:outputText value="SOEID"/>
                        <p:autoComplete completeMethod="#{busquedaEmpleadosBean.completeSoeid}" var="emp"
                                        itemLabel="#{emp.soeid}" style="width: 100%"
                                        itemValue="#{emp}" forceSelection="true"
                                        converter="recursoAutoCompleteConverter">
                            <p:ajax event="itemSelect" listener="#{busquedaEmpleadosBean.handleSelect}" update="tblEmpleados" />
                            <p:column>
                                <h:outputText value="#{emp.soeid} - #{emp.nombreCompleto}"/>
                            </p:column>
                        </p:autoComplete>
                        
                        <h:outputText value="NOMBRE"/>
                        <p:autoComplete completeMethod="#{busquedaEmpleadosBean.completeName}" var="emp"
                                        itemLabel="#{emp.nombre} #{emp.apellido}"
                                        itemValue="#{emp}" forceSelection="true" size="50"
                                        converter="recursoAutoCompleteConverter">
                            <p:ajax event="itemSelect" listener="#{busquedaEmpleadosBean.handleSelect}" update="tblEmpleados" />
                            <p:column>
                                <h:outputText value="#{emp.nombreCompleto}"/>
                            </p:column>
                        </p:autoComplete>
                        
                        <h:outputText value="APELLIDO"/>
                        <p:autoComplete completeMethod="#{busquedaEmpleadosBean.completeLastName}" var="emp"
                                        itemLabel="#{emp.nombreCompleto}"
                                        itemValue="#{emp}" size="50"
                                        converter="recursoAutoCompleteConverter">
                            <p:ajax event="itemSelect" listener="#{busquedaEmpleadosBean.handleSelect}" update="tblEmpleados" />
                            <p:column>
                                <h:outputText value="#{emp.apellido}, #{emp.nombre}"/>
                            </p:column>
                        </p:autoComplete>
                        
                    
                </p:panelGrid>
                
                <p:dataTable id="tblEmpleados" value="#{busquedaEmpleadosBean.empleados}" var="e" tableStyle="width:auto">
                    <p:column headerText="SOEID">
                        <h:outputText value="#{e.soeid}"/>
                    </p:column>
                    <p:column headerText="NOMBRE">
                        <h:outputText value="#{e.nombreCompleto}"/>
                    </p:column>
                    <p:column headerText="AREA">
                        <h:outputText value="#{e.area.descripcion}"/>
                    </p:column>
                    <p:column headerText="FECHA INGRESO">
                        <h:outputText value="#{e.fechaIngreso}">
                            <f:convertDateTime pattern="dd/MM/yyyy"/>
                        </h:outputText>
                    </p:column>
                </p:dataTable>
            </ui:define>

        </ui:composition>

    </body>
</html>
